<!DOCTYPE html>
<style>
html {
  color: grey;
}
.currentColor {
    background-image: linear-gradient(currentColor, currentColor);
    height: 20px;
}
</style>
<div style="color: green">
  <div class="currentColor">The color of the background should be <code>green</code></div>
</div>
<div style="color: blue">
  <div class="currentColor">The color of the background should be <code>blue</code></div>
</div>

<div style="color: green;">
  <div style="color: yellow;">
    <div class="currentColor">The color of the background should be <code>yellow</code></div>
  </div>
  <div class="currentColor">The color of the background should be <code>green</code></div>
</div>

<div class="currentColor" style="color: cyan;">The color of the background should be <code>cyan</code></div>
<div class="currentColor">The color of the background should be <code>grey</code></div>
